<template>
	<div style="height: 100%;overflow:auto" class="main">
		<div class="main-top">
			<a href="../index.html"><img src="@/assets/images/logo.png" class="top-logo"></a>
			<img src="../../../static/images/shadow.png" alt="" class="shadow" style="margin-right: 20px;margin-top: 10px">
			<ul class="menu-list">
				<li v-for="item in menuList" :key="item.id" @click="isHref(item)" :class="{select:item.mid==select}">
					<div :id="item.meta" class="menu-icon"></div>
					<div>{{item.title}}</div>
				</li>
			</ul>
			<div class="user">
				<img src="../../../static/images/shadow.png" alt="" class="shadow">
				<img :src="headPhoto" alt="头像">
				<div>{{name}}</div>
				<div class="operationBox">
					<div class="triangle"></div>
					<ul>
						<li @click="changeInfor">
							基本信息
						</li>
						<li @click="logout">
							退出登录
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div id="nav">
			<ul>
				<li v-for="item in navList" :key="item.id" @click="nav(item)" v-bind:class="{selected:item.mid==selected}">
					{{item.title}}
				</li>
			</ul>
		</div>
		<div style="clear:both;height: calc(100% - 134px);">
			<Content class="main-content-con">
				<div class="main-layout-con">
					<Content class="content-wrapper">
						<router-view />
					</Content>
				</div>
			</Content>
		</div>
	</div>
</template>
<script>
	import Util from '@/utils/index'
	export default {
		data () {
			return {
				collapsed: false,
				isFullscreen: false,
				showSedMenu: false,
				selected: sessionStorage.selected,
				select: sessionStorage.select,
				user: {},
				headPhoto: '',
				name: '',
				authority: '',
				roleId: [],
				examineState: '',
				menuList: [],
				navList: []
			}
		},
		methods: {
			isHref (index) {
				this.navList = []
				this.select = index.mid
				sessionStorage.aselect = index.mid
				this.navList = [{mid: 0, title: ''}]
				sessionStorage.anavList = JSON.stringify(this.navList)
				if (index.menuName !== null && index.menuName !== '' && index.menuName !== undefined) {
					sessionStorage.aname = index.menuName
					// 主菜单跳转
					this.$router.push({
						name: index.menuName
					})
				} else {
					// 生成子菜单
					this.navList = index.child
					sessionStorage.anavList = JSON.stringify(index.child)
					// 主菜单点击时，自动跳转第一个子菜单
					this.selected = this.navList[0].mid
					sessionStorage.aselected = this.navList[0].mid
					sessionStorage.aname = this.navList[0].menuName
					this.$router.push({
						name: this.navList[0].menuName
					})
				}
			},
			// 子菜单跳转
			nav (index) {
				sessionStorage.aname = index.menuName
				this.$router.push({
					name: index.menuName
				})
				this.selected = index.mid
				sessionStorage.aselected = index.mid
			},
			// 退出
			logout () {
				Util.logout()
// 				this.$router.push({
// 					name: 'login'
// 				})
				location.href = '/login.html'
			},
			// 进入个人中心
			changeInfor () {
				this.$router.push({path: '/Personal'})
			}
		},
		mounted () {
			this.user = JSON.parse(sessionStorage.user)
			this.name = this.user.userName
			// 获取角色对应的菜单
			this.menuList = this.user.menus
			if (sessionStorage.aselect !== undefined && sessionStorage.aselect !== '') {
				this.select = sessionStorage.aselect
			} else {
				this.select = sessionStorage.aselect = this.menuList[0].mid
			}
			if (sessionStorage.anavList !== undefined && sessionStorage.anavList !== '') {
				this.navList = JSON.parse(sessionStorage.anavList)
			} else {
				sessionStorage.anavList = JSON.stringify(this.menuList[0].child)
				this.navList = JSON.parse(sessionStorage.anavList)
			}
			if (sessionStorage.aselected !== undefined && sessionStorage.aselected !== '') {
				this.selected = sessionStorage.aselected
			} else {
				this.selected = sessionStorage.aselected = this.menuList[0].child[0].mid
			}
			if (sessionStorage.aname !== undefined && sessionStorage.aname !== '') {
				this.$router.push({
					name: sessionStorage.aname
				})
			}
			// 根据id获取用户信息
			this.$api.get(0, '/usr/v2/user?uId=' + this.user.id, {}, r => {
				if (r.data.code === 0) {
					this.headPhoto = r.data.data.headPhoto
				} else {
					this.$Message.error('获取失败')
				}
			})
		},
		destroyed () {
			sessionStorage.removeItem('aselect')
			sessionStorage.removeItem('anavList')
			sessionStorage.removeItem('aselected')
		}
	}
</script>
<style lang="less">
	@import './main.less';
</style>
